class Div {
	constructor(id, classN) {
		this.father = document.querySelector(id);
		this.aInp = this.father.querySelectorAll("input");
		this.aDiv = this.father.querySelectorAll("li");
		this.classN = document.querySelector(classN);
		this.left = this.classN.querySelector("#oSp1");
		this.right = this.classN.querySelector("#oSp2");
		this.num = 0;
	}
	left1() {
		var _this = this;
		this.left.onclick = function() {
			_this.num--;
			if(_this.num <= -1) {
				_this.num = 2;
			}
//			console.log(_this.num)
			_this.show1(_this.num)
		}
	}
	right1() {
		var _this = this;
		this.right.onclick = function() {
			_this.num++;
			console.log(_this.aInp.length)
			if(_this.num >= _this.aInp.length) {
				_this.num = 0;
			}

			_this.show1(_this.num)
		}
	}
	show1(i) {
		for(let j = 0; j < this.aInp.length; j++) {
			this.aInp[j].className = "";
			this.aDiv[j].className = "";
		}
		this.aInp[i].className = "active";
		this.aDiv[i].className = "show";
	}

}

export default Div;